<template>
	<div class="madp-material">
		<recommend
			v-if="activeObj.activeIndex === 0"
			:activeObj="activeObj"
		></recommend>
		<hot-list v-if="activeObj.activeIndex === 1"></hot-list>
		<content-list
			v-if="activeObj.activeIndex > 1"
			:activeObj="activeObj"
		></content-list>
	</div>
</template>

<script>
import Recommend from './recommend'
import HotList from './hot-list'
import ContentList from './content-list'
export default {
	props: {
		activeObj: {
			type: Object,
			default: () => {
				return {
					activeIndex: 0,
				}
			},
		},
	},
	components: {
		Recommend,
		HotList,
		ContentList,
	},
	data() {
		return {}
	},
	watch: {
		activeObj(newVal) {
		},
	},
}
</script>

<style lang="scss" scoped>
.madp-material {
	width: 100%;
}
</style>